<template>

	<tm-fullView>
		<tm-menubars title="组件模块" color="bg-gradient-primary-lighten" :showback="true"></tm-menubars>
		
		<tm-sheet  :padding="[16,16]" :shadow="24" >
			
			<tm-grid @change="openurl"   :list="list" :icon-size="50" ></tm-grid>
		</tm-sheet>
		<view style="height: 150rpx;"></view>
		
		<tm-dialog
			v-model="show"
			title="提醒"
			content="因小程序大小限制，本demo页面过大，主体导入的js超过2mb，对于分包已无作用，因此如需查询相关demo请前往H5预览，一定是兼容小程序的,不用担心."
		></tm-dialog>
	</tm-fullView>
</template>
<script>
	import tmFullView from "@/tm-vuetify/components/tm-fullView/tm-fullView.vue"
	import tmMenubars from "@/tm-vuetify/components/tm-menubars/tm-menubars.vue"
	import tmSheet from "@/tm-vuetify/components/tm-sheet/tm-sheet.vue"
	import tmGrid from "@/tm-vuetify/components/tm-grid/tm-grid.vue"
	import tmDialog from "@/tm-vuetify/components/tm-dialog/tm-dialog.vue"
	
	export default {
		components:{tmFullView,tmMenubars,tmSheet,tmGrid,tmDialog},
		data() {
			return {
				show:false,
				list:[
					{ text: '文件上传', icon: 'icon-databaseset-fill' ,url:'../comtwo/uploadfile',dot:true },
					{ text: '卡片', icon: 'icon-databaseset-fill' ,url:'../comtwo/card',dot:true },
					{ text: '宫格排序', icon: 'icon-databaseset-fill' ,url:'../comtwo/dragGrid',dot:true },
					{ text: '数字翻牌', icon: 'icon-databaseset-fill' ,url:'../comtwo/flop',dot:true },
					{ text: '图片裁剪', icon: 'icon-databaseset-fill' ,url:'../comtwo/avatarCrop',dot:true },
					{ text: '相册集', icon: 'icon-databaseset-fill' ,url:'../comtwo/album',dot:true },
					{ text: '分段器选项', icon: 'icon-databaseset-fill' ,url:'../comtwo/segTabs',dot:true },
					{ text: '提示框', icon: 'icon-databaseset-fill' ,url:'../comtwo/message',dot:true },
					{ text: '树状结构', icon: 'icon-databaseset-fill' ,url:'../comtwo/tree',dot:true },
					{ text: '拖放排序', icon: 'icon-databaseset-fill' ,url:'../comtwo/dragList',dot:true },
					{ text: '滑动单元格', icon: 'icon-databaseset-fill' ,url:'../comtwo/switchList',dot:true },
					{ text: '地图选点', icon: 'icon-databaseset-fill' ,url:'../comtwo/mapSelectedPoint' },
					{ text: '骨架加载器', icon: 'icon-databaseset-fill' ,url:'../comtwo/skeleton' },
					{ text: '横向滚动', icon: 'icon-databaseset-fill' ,url:'../comtwo/scroll' },
					{ text: '优惠券', icon: 'icon-databaseset-fill' ,url:'../comtwo/coupon' },
					{ text: 'lottie动画', icon: 'icon-databaseset-fill' ,url:'../lottie/index'},
					{ text: '瀑布流', icon: 'icon-databaseset-fill' ,url:'../comtwo/flowLayout' },
					{ text: '城市索引', icon: 'icon-databaseset-fill' ,url:'../comtwo/quickCity'},
					{ text: '图片校验', icon: 'icon-databaseset-fill' ,url:'../comtwo/verificationImg' },
					{ text: '时间周', icon: 'icon-databaseset-fill' ,url:'../comtwo/weekbar'},
					{ text: '表单', icon: 'icon-databaseset-fill' ,url:'../comtwo/form' },
					{ text: '搜索框', icon: 'icon-databaseset-fill' ,url:'../comtwo/search' },
					{ text: '双向滑块', icon: 'icon-databaseset-fill' ,url:'sliders' },
					{ text: '展开更多', icon: 'icon-databaseset-fill' ,url:'more' },
					{ text: '表格', icon: 'icon-databaseset-fill' ,url:'table' },
					{ text: '帮助提示', icon: 'icon-databaseset-fill' ,url:'helpTips' },
					{ text: '内容定位', icon: 'icon-databaseset-fill' ,url:'position' },
					{ text: '动画组件', icon: 'icon-databaseset-fill' ,url:'translate' },
					{ text: '进度条', icon: 'icon-databaseset-fill',url:'propress' },
					{ text: '分页', icon: 'icon-databaseset-fill' ,url:'pagination'},
					{ text: '图片', icon: 'icon-databaseset-fill' ,url:'images'},
					{ text: '签名板', icon: 'icon-databaseset-fill' ,url:'signBoard'},
					{ text: '九宫格', icon: 'icon-databaseset-fill' ,url:'grid'},
					{ text: '上拉刷新', icon: 'icon-databaseset-fill' ,url:'pullBottom'},
					{ text: '数据空', icon: 'icon-databaseset-fill' ,url:'empty'},
					{ text: '加载状态', icon: 'icon-databaseset-fill' ,url:'loadding'},
					{ text: '键盘', icon: 'icon-databaseset-fill' ,url:'keyborad'},
					{ text: '密码输入框', icon: 'icon-databaseset-fill',url:'password' },
					{ text: '评分', icon: 'icon-databaseset-fill',url:'rate' },
					{ text: '倒计时', icon: 'icon-databaseset-fill',url:'countdown' },
					{ text: '选项卡', icon: 'icon-databaseset-fill' ,url:'tabs'},
					{ text: '时间轴', icon: 'icon-databaseset-fill' ,url:'timeline'},
					{ text: '步骤条', icon: 'icon-databaseset-fill' ,url:'teps'},
					{ text: '分割线', icon: 'icon-databaseset-fill' ,url:'divider'},
					{ text: '步进器', icon: 'icon-databaseset-fill' ,url:'stepper'},
					{ text: '动作面板', icon: 'icon-databaseset-fill' ,url:'actionSheet'},
					{ text: '快速操作栏', icon: 'icon-databaseset-fill',url:'actionSheetMenu' },
					{ text: '下拉选项', icon: 'icon-databaseset-fill',url:'dropDownMenu' },
					{ text: '分享面板', icon: 'icon-databaseset-fill' ,url:'shareSheet'},
					{ text: '粘性布局', icon: 'icon-databaseset-fill' ,url:'sticky'},
					{ text: '纸片', icon: 'icon-databaseset-fill' ,url:'tags'},
					{ text: '分类选择', icon: 'icon-databaseset-fill',url:'treeSelect'  },
					{ text: '侧边导航', icon: 'icon-databaseset-fill',url:'sliderNav' },
					{ text: '对话框', icon: 'icon-databaseset-fill',url:'dialog' },
					{ text: '索引', icon: 'icon-databaseset-fill' ,url:'quickIndex'},
					{ text: '轮播', icon: 'icon-databaseset-fill' ,url:'swiper'},
					{ text: '黑色遮罩', icon: 'icon-databaseset-fill' ,url:'maskFlow'},
					{ text: '填屏', icon: 'icon-databaseset-fill' ,url:'fullView'},
					{ text: '消息提示框', icon: 'icon-databaseset-fill',url:'alerts' },
					{ text: '头像框', icon: 'icon-databaseset-fill' ,url:'avatar'},
					{ text: '徽章/角标', icon: 'icon-databaseset-fill' ,url:'badges'},
					{ text: '横幅消息', icon: 'icon-databaseset-fill' ,url:'banners'},
					{ text: '导航工具栏', icon: 'icon-databaseset-fill' ,url:'bottomnavigation',dot:true },
					{ text: '按钮', icon: 'icon-databaseset-fill' ,url:'button',dot:true },
					{ text: '日历', icon: 'icon-databaseset-fill' ,url:'calendar'},
					{ text: '复选框', icon: 'icon-databaseset-fill' ,url:'checkbox'},
					{ text: '布局', icon: 'icon-databaseset-fill',url:'row' },
					{ text: '悬浮按钮', icon: 'icon-databaseset-fill',url:'flotbutton' },
					{ text: '列表', icon: 'icon-databaseset-fill' ,url:'listitem'},
					{ text: '单选框', icon: 'icon-databaseset-fill',url:'radio' },
					{ text: '图标', icon: 'icon-databaseset-fill' ,url:'icons'},
					{ text: '输入框', icon: 'icon-databaseset-fill' ,url:'input' },
					{ text: '弹出菜单', icon: 'icon-databaseset-fill' ,url:'menu'},
					{ text: '菜单工具', icon: 'icon-databaseset-fill' ,url:'menubars'},
					{ text: '级联选择器', icon: 'icon-databaseset-fill' ,url:'pickers'},
					{ text: '地区选择', icon: 'icon-databaseset-fill' ,url:'pickers' },
					{ text: '日期下拉', icon: 'icon-databaseset-fill',url:'pickers'  },
					{ text: 'poup', icon: 'icon-databaseset-fill',url:'poup' },
					{ text: '宽高比', icon: 'icon-databaseset-fill' ,url:'ratio'},
					{ text: '基础容器', icon: 'icon-databaseset-fill' ,url:'sheet'},
					{ text: '滑块', icon: 'icon-databaseset-fill',url:'slider' },
					{ text: '开关', icon: 'icon-databaseset-fill' ,url:'switch'},
					{ text: '上传', icon: 'icon-databaseset-fill' ,url:'upload' },
				]
			}
		},
		methods: {
			openurl(e){
				let t = this;
				console.log(e);
				uni.navigateTo({
					url:e.data.url,
					fail: e => {
						t.show = true;
					}
				})
			}
		}
	}
</script>

<style>

</style>
